<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>上传头像</title>
    <link rel="stylesheet" href="../font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">  
    <link rel="stylesheet" href="../css/com.css">
</head>
<body>
  <header class="myheader">
        <div class="header_main">
            <div class="header_left">
                <a href="../index.html">北游论坛 </a>
            </div>
            <div class="header_right">
                <a href="./send.html">
                    <i class="fa fa-plus" aria-hidden="true"></i>
                    发表
                </a>
            </div>
        </div>
  </header>
  <main class="formMine">
      <input type="file" id="myfile">
        <div class="changPhoto">
            <i class="fa fa-plus" aria-hidden="true"></i>
        </div>
         <img src="" alt="" id="photoImg">
        <button type="button" class="btn btn-primary" onclick="goHome()">确认上传</button>
   </main>
</body>
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="../js/sendAjax.js"></script>
<script>
    $("#myfile").hide();
    $("#photoImg").hide();
    $(".changPhoto").click(()=>{
        document.getElementById("myfile").click();
    })
    $("#myfile").change(async (e)=>{
        // console.log(e)
        // 获取文件对象信息
        let file = e.target.files[0];
        // 创建formData对象
        let data = new FormData();
        // 将文件对象信息添加到FormData对象中
        data.append("myFile",file);
        let res = await ajaxFile("/upload/photo","post",data);
        console.log(res)
        $("#photoImg").show();
        $(".changPhoto").hide();
        $("#photoImg").attr("src",res.url)
    })
    function goHome(){
        let url = $("#photoImg").attr("src");
        if(url ===''){
            alert("请您先选择图片")
            return
        }
        window.location.href = '../index.html'
    }
</script>
</html>